<template>
  <div class="wapper notice_c" style="padding-top: 10px">
    <affix
      :label="$t('configLazyLoad.operateLogManage.logQuery')"
      >
      <el-form label-position="top" label-width="80px" :model="noticeForm">
        <el-row :gutter="20">
          <el-col :span="6">
            <el-form-item :label="$t('configLazyLoad.operateLogManage.excute')" class="padd-r-10">
              <agent-select
                style="width: 100%"
                :placeholder = "$t('config.agent.pleaseParentAgent')"
                @agentChange = "agentChange"
                :customfield = "customize"
                ref = "agnetSelect"
                >
              </agent-select>
            </el-form-item>
          </el-col>
          <el-col :span="15">
            <el-row :gutter="20">
              <el-form-item :label="$t('configLazyLoad.operateLogManage.excuteTime')" class="padd-r-10">
                <el-col :span="11" style="padding-left: 0px;padding-right: 0px">
                  <el-date-picker
                    id="operate_log_manage_begin"
                    v-model="noticeForm.publishTimeBegin"
                    type="datetime"
                    :editable="false"
                    :placeholder="$t('public.startTime')"
                    style="width: 100%">
                  </el-date-picker>
                </el-col>
                <el-col class="bet" :span="2" style="padding-left: 6px">
                </el-col>
                <el-col :span="11" style="padding-right: 0px">
                  <el-date-picker
                    id="operate_log_manage_end"
                    v-model="noticeForm.publishTimeEnd"
                    type="datetime"
                    :editable="false"
                    :placeholder="$t('public.endTime')"
                    style="width: 100%">
                  </el-date-picker>
                </el-col>
              </el-form-item>
            </el-row>
          </el-col>
        </el-row>
        <el-row :gutter="20" class="margin-t-10">
          <el-col :span="6" class="cycle-time">
            <el-form-item :label="$t('configLazyLoad.operateLogManage.excuteAction')" class="padd-r-10">
              <el-select v-model="noticeForm.operate" :placeholder="$t('public.pleasePick')" style="width:100%">
                <el-option
                  v-for="item in operateList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6" class="cycle-time" style="padding-left:0;">
            <el-form-item :label="$t('configLazyLoad.operateLogManage.dataType')">
              <el-select v-model="noticeForm.type" :placeholder="$t('public.pleasePick')" style="width:100%">
                <el-option
                  v-for="item in statusList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24" style="text-align: right">
            <el-button class="primary_btn report_excel_btn" @click.stop="resetBtn">{{$t('public.reset')}}</el-button>
            <el-button type="primary" class="primary_btn" @click.stop="search">{{$t('public.search2')}}</el-button>
          </el-col>
        </el-row>
      </el-form>
    </affix>
    <affix
      :label="$t('configLazyLoad.operateLogManage.logQueryResult')"
      style="padding-right: 5px"
      >
      <noticeTab
        :tableData="tableData"
        :count="count"
        :currPage = "currPage"
        @trunPages="trunPages"
        @handlRenew="handlRenew"
        @del="delOperateLog"
        >
      </noticeTab>
    </affix>
  </div>
</template>
<script>
  import Affix from '@/components/ui-modules/affix/Affix'
  import AgentSelect from '@/components/public-modules/cache/AgentSelect'
  import noticeTab from './base/noticeTab'
  import { resetForm, trimObjEmptyValue, deepClone, getFormatDateTime } from '@/utils/m7Utils.js'
  export default {
    name: 'operateLogManage',
    data () {
      return {
        isShowEdit: false,
        isShowAddOrEdit: false,
        isEdit: false,
        noticeInfo: {},
        statusList: [
          {label: this.$t('public.all'), value: ''},
          {label: this.$t('public.business'), value: 'business'},
          {label: this.$t('public.customer'), value: 'customer'},
          {label: this.$t('monitor.serviceNum'), value: 'serviceno'},
          {label: this.$t('configLazyLoad.operateLogManage.ivrProcess'), value: 'ivrprocess'},
          {label: this.$t('configLazyLoad.operateLogManage.webNo'), value: 'accessno_web'},
          {label: this.$t('configLazyLoad.operateLogManage.wechatNo'), value: 'accessno_wechat'},
          {label: this.$t('configLazyLoad.operateLogManage.weiboNo'), value: 'accessno_weibo'},
          {label: this.$t('configLazyLoad.operateLogManage.appNo'), value: 'accessno_sdk'},
          {label: this.$t('configLazyLoad.operateLogManage.callGroup'), value: 'skillgroup_normal'},
          {label: this.$t('configLazyLoad.operateLogManage.imGroup'), value: 'skillgroup_im'},
          {label: this.$t('configLazyLoad.operateLogManage.emailGroup'), value: 'skillgroup_email'},
          {label: this.$t('configLazyLoad.operateLogManage.miniConfig'), value: 'accessno_wechat_mini_app'},
          {label: this.$t('configLazyLoad.operateLogManage.agentConfig'), value: 'agent'},
          {label: this.$t('configLazyLoad.operateLogManage.deptConfig'), value: 'department'}
        ],
        operateList: [
          {label: this.$t('public.all'), value: ''},
          {label: this.$t('public.delete'), value: 'delete'},
          {label: this.$t('public.edit2'), value: 'update'},
          {label: this.$t('configLazyLoad.operateLogManage.batchEdit'), value: 'batchUpdate'},
          {label: this.$t('configLazyLoad.operateLogManage.batchImportEdit'), value: 'batchUpdateUserFromExcel'}
        ],
        customize: [],
        noticeForm: {
          updateAgent: '',
          title: '',
          publishTimeBegin: '',
          publishTimeEnd: '',
          type: '',
          operate: ''
        },
        tableData: [],
        currPage: 1,
        pageSize: 10,
        count: 0
      }
    },
    methods: {
      search () {
        this.isShowAddOrEdit = false
        this.isShowEdit = false
        this.currPage = 1
        this.searchBtn()
      },
      trunPages (page) {
        this.currPage = page
        this.searchBtn()
      },
      resetBtn () {
        this.$refs.agnetSelect.value = ''
        resetForm(this.noticeForm)
      },
      searchBtn () {
        let data = {}
        data = deepClone(this.noticeForm)
        trimObjEmptyValue(data)
        data.publishTimeBegin && (data.publishTimeBegin = getFormatDateTime(data.publishTimeBegin))
        data.publishTimeEnd && (data.publishTimeEnd = getFormatDateTime(data.publishTimeEnd))
        console.log(data)
        if (data.publishTimeBegin && data.publishTimeEnd) {
          if (new Date(this.noticeForm.publishTimeBegin).getTime() > new Date(this.noticeForm.publishTimeEnd).getTime()) {
            this.$message.error(this.$t('configLazyLoad.operateLogManage.logTip1'))
            return
          }
          data.createTime = { $gte: data.publishTimeBegin, $lte: data.publishTimeEnd }
        } else if (data.publishTimeBegin) {
          data.createTime = { $gte: data.publishTimeBegin }
        } else if (data.publishTimeEnd) {
          data.createTime = { $lte: data.publishTimeEnd }
        }
        delete data.publishTimeBegin
        delete data.publishTimeEnd
        data.limit = this.pageSize
        data.page = this.currPage
        data.account = this.$store.state.session.user.account
        this.$store.dispatch('queryBusOrCustLogList', data).then(resp => {
          if (resp && resp.success) {
            this.count = resp.count
            if (resp.count) {
              this.tableData = this.getNewTableData(resp.list)
            } else {
              this.tableData = []
            }
          }
        })
      },
      getNewTableData (data) {
        let arr = data || []
        for (let i = 0; i < arr.length; i++) {
          arr[i].operateName = '- -'
          if (arr[i].operate === 'delete') {
            arr[i].operateName = this.$t('public.delete')
          } else if (arr[i].operate === 'update') {
            arr[i].operateName = this.$t('public.edit2')
          } else if (arr[i].operate === 'batchUpdate') {
            arr[i].operateName = this.$t('configLazyLoad.operateLogManage.batchEdit')
          } else if (arr[i].operate === 'batchUpdateUserFromExcel') {
            arr[i].operateName = this.$t('configLazyLoad.operateLogManage.batchImportEdit')
          }
          arr[i].typeName = '- -'
          if (arr[i].type === 'customer') {
            arr[i].typeName = this.$t('public.customer')
          } else if (arr[i].type === 'serviceno') {
            arr[i].typeName = this.$t('monitor.serviceNum')
          } else if (arr[i].type === 'ivrprocess') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.ivrProcess')
          } else if (arr[i].type === 'accessno_web') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.webNo')
          } else if (arr[i].type === 'accessno_wechat') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.wechatNo')
          } else if (arr[i].type === 'accessno_weibo') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.weiboNo')
          } else if (arr[i].type === 'accessno_sdk') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.appNo')
          } else if (arr[i].type === 'skillgroup_normal') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.callGroup')
          } else if (arr[i].type === 'skillgroup_im') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.imGroup')
          } else if (arr[i].type === 'skillgroup_email') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.emailGroup')
          } else if (arr[i].type === 'business') {
            arr[i].typeName = this.$t('public.business')
          } else if (arr[i].type === 'accessno_wechat_mini_app') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.miniConfig')
          } else if (arr[i].type === 'agent') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.agentConfig')
          } else if (arr[i].type === 'department') {
            arr[i].typeName = this.$t('configLazyLoad.operateLogManage.deptConfig')
          }
          if (arr[i].type === 'customer' || arr[i].type === 'business') {
            arr[i].regainStatus = 'noRecovery'
            arr[i].recoveryContent = ''
            if (arr[i].recoveryStatus) {
              if (arr[i].recoveryStatus === 'recoverySuccess') {
                arr[i].regainStatus = 'recoverySuccess'
              } else if (arr[i].recoveryStatus === 'recoveryFail') {
                let dayNum = (new Date().getTime() - new Date(arr[i].createTime).getTime()) / 1000 / 3600 / 24
                if (dayNum > 30) {
                  arr[i].regainStatus = 'noRecovery'
                } else {
                  arr[i].regainStatus = 'recoveryFail'
                }
              } else if (arr[i].recoveryStatus === 'awaitRecovery') {
                let dayNum = (new Date().getTime() - new Date(arr[i].createTime).getTime()) / 1000 / 3600 / 24
                if (dayNum > 30) {
                  arr[i].regainStatus = 'noRecovery'
                } else {
                  arr[i].regainStatus = 'recovery'
                }
              } else if (arr[i].recoveryStatus === 'recovering') {
                arr[i].regainStatus = 'recovering'
              }
            }
          }
        }
        return arr
      },
      handlRenew (row) {
        let data = {'_id': row._id, type: row.type}
        this.$confirm(this.$t('configLazyLoad.operateLogManage.logTip2', {num: row.num}), this.$t('public.tip'), {
          confirmButtonText: this.$t('public.confirm'),
          cancelButtonText: this.$t('public.cancel'),
          cancelButtonClass: 'primary_btn',
          confirmButtonClass: 'primary_btn',
          type: 'warning'
        }).then(() => {
          this.$store.dispatch('logDataRecovery', data).then(resp => {
            if (resp && resp.success) {
              this.$message({
                message: this.$t('configLazyLoad.operateLogManage.recoverSucc'),
                type: 'success'
              })
              this.searchBtn()
              if(data.type == 'business'){
                //刷新新版工单左侧菜单栏数量统计
                this.$store.commit('business/REFRESH_MENUBAR',Math.random())
              }
            }
          })
        }).catch(() => {
          console.log('取消')
        })
      },
      delOperateLog (row) {
        let data = {'_id': row._id}
        this.$confirm(this.$t('configLazyLoad.operateLogManage.logTip3'), this.$t('public.tip'), {
          confirmButtonText: this.$t('public.confirm'),
          cancelButtonText: this.$t('public.cancel'),
          cancelButtonClass: 'primary_btn',
          confirmButtonClass: 'primary_btn',
          type: 'warning'
        }).then(() => {
          this.$store.dispatch('deleteBusOrCustLogList', data).then(resp => {
            if (resp && resp.success) {
              this.$message({
                message: this.$t('config.channel.deleteSuccess'),
                type: 'success'
              })
              this.currPage = 1
              this.searchBtn()
            }
          })
        }).catch(() => {
          console.log('取消')
        })
      },
      agentChange (val) {
        this.noticeForm.agent = val
      }
    },
    components: {
      Affix,
      AgentSelect,
      noticeTab
    },
    beforeMount () {
      this.searchBtn()
    }
  }
</script>

<style lang="stylus" scoped>
  @import "../../../../assets/common.styl"
  .padd-r-10
    padding-right 10px
  .margin-t-10
    margin-top 10px
  .wapper
    padding 0px
    padding-right 10px
    padding-left 16px
    height calc(100vh - 95px)
    overflow-y auto
    font-size 12px
  .bet
    &:before
      content: ''
      display inline-block
      width 15px
      height 1px
      margin 3px 12px
      background $cf-gray5
      text-align center
  .table-wapper
    display flex
    height 100%
  .notice-table
    flex 7
  .notice-create__box
    flex 3
    border-left 1px solid #e7e7eb
    margin-left 16px
    padding-left 16px
  .wrapper .overScroll
     overflow-y hidden
</style>
